<template>
    <view class="userDetails">
        <view class="userTouxiang" @tap="chooseimage">
            <text>头像</text>
            <view class="userTouxiang_img">
                <image src="{{userObj.avatar ? userObj.avatar : 'https://gatherabc.oss-cn-qingdao.aliyuncs.com/xcx/goumai.png'}}"></image>
            </view>
            <i class="iconfont icon-jiantou"></i>
        </view>
        <navigator class="user_biaodan" url="/pages/personalCenter/name?name={{userObj.nickname}}">
            <text>昵称</text>
            <view>{{userObj.nickname ? userObj.nickname : '默认昵称'}}</view>
            <i class="iconfont icon-jiantou"></i>
        </navigator>
        <navigator class="user_biaodan mt_0" url="/pages/personalCenter/menAndwomen?sex={{userObj.sex}}">
            <text>性别</text>
            <view>{{userObj.sex === 'MALE' ? '男' : '女'}}</view>
            <i class="iconfont icon-jiantou"></i>
        </navigator>
        <navigator class="user_biaodan" url="/pages/personalCenter/intro?remark={{userObj.remark}}">
            <text>简介</text>
            <view class="my_remark">{{userObj.remark ? userObj.remark : ''}}</view>
            <i class="iconfont icon-jiantou"></i>
        </navigator>
    </view>
</template>
<script>
import wepy from 'wepy'
import api from '@/api/api'
import tip from '@/utils/tip'
import { USER_INFO, USER_SPECICAL_INFO, USER_ID } from '@/utils/constant'

export default class userDetails extends wepy.page {
  config = {
    // 配置当前页面
    navigationBarTitleText: '用户详情' // 头部标题
  }
  components = {}

  data = {
    userObj: {},
      policyInfo:''
  }

    /**
     * web端上传文件获取上传policy
     * @returns {Promise<void>}
     */
    async policyFun() {
        const t = this;
        let a = await api.getWebPolicy();
        if (a.data.code == 0) {
            t.policyInfo = a.data.data
        } else {
            tip.error(a.data.msg)
        }
        t.$apply()
    }
  // 获取个人信息
  async user_info() {
    let that = this
    let user_id = wepy.getStorageSync(USER_ID) || ''
    api
      .getUserInformation(
        {
          query: {}
        },
        user_id
      )
      .then(function(res) {
        if (res.data.code == 0) {
          that.userObj = res.data.data
          that.$apply()
        } else {
          tip.error(res.data.msg)
        }
      })
  }

  // 修改头像
  async modifyInfo(a) {
    let that = this
    let user_id = wepy.getStorageSync(USER_ID) || ''
    api.updateUserInformation(
        {
          query: {
            userId: user_id,
            key: 'avatar',
            value: that.userObj.avatar
          },
          method: 'PUT'
        },
        'userId=' + user_id + '&key=avatar&value=' + a
      )
      .then(function(res) {
        if (res.data.code == 0) {
          that.userObj.avatar = a
          that.$apply()
        } else {
          tip.error(res.data.msg)
        }
      })
  }


  onLoad() {
    this.user_info()
  }

  onShow() {
    this.user_info()
  }

  methods = {
    // 方法
    chooseimage() {
      let self = this
      wx.showActionSheet({
        itemList: ['从相册中选择', '拍照'],
        success: function(res) {
          if (!res.cancel) {
            if (res.tapIndex == 0) {
              self.methods.chooseWxImage('album', self)
            } else if (res.tapIndex == 1) {
              self.methods.chooseWxImage('camera', self)
            }
          }
        }
      })
    },
    chooseWxImage(type, a) {
      wx.chooseImage({
        count: 1, // 默认9
        sizeType: ['original', 'compressed'],
        sourceType: [type],
        success: function(res) {
            wx.uploadFile({
                url: 'https://gatherapi.haomengpeifang.com/aliyun/oss/upload',
                filePath: res.tempFilePaths[0],
                name: 'file',
                success: function (req) {
                    let r;
                    if(typeof (req.data) == 'string'){
                        r = JSON.parse(req.data);
                    }else {
                        r = req;
                    }
                    if (r.code == 0) {
                        a.modifyInfo(r.data[0]);
                        a.$apply();
                    } else {
                        tip.error(r.msg)
                    }
                }
            })
        }
      })
    }
  }
    onUnload(){
        wx.switchTab({
            url: '/pages/personalCenter/me'
        })
    }
  events = {}
}
</script>
<style lang="less">
.userDetails {
    .userTouxiang {
        background: #fff;
        width: 100%;
        height: 120rpx;
        line-height: 120rpx;
        display: flex;
        padding: 20rpx 0;
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #ddd;

        text {
            padding-left: 30rpx;
            margin-right: auto;
        }
        .userTouxiang_img {
            width: 100rpx;
            height: 100rpx;
            padding: 10rpx;
            background: #f5f5f7;
            border-radius:10rpx;
            image {
                width: 100%;
                height: 100%;
            }
        }
        i {
            padding-left: 30rpx;
            padding-right: 30rpx;
            color: #999;
            font-size: 16px !important;
        }
    }
    .mt_0 {
        margin-top: 0 !important;
        border-top: 0 !important;
    }
    .user_biaodan {
        background: #fff;
        width: 100%;
        height: 60rpx;
        line-height: 60rpx;
        display: flex;
        padding: 20rpx 0;
        border-top: 1px solid #ddd;
        margin-top: 20rpx;
        border-bottom: 1px solid #ddd;

        text {
            padding-left: 30rpx;
            margin-right: auto;
        }
        view {
            color: #999;
        }
        i {
            color: #999;
            padding-left: 20rpx;
            padding-right: 30rpx;
            font-size: 16px !important;
        }
        .my_remark{
          width: 400rpx;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
        }
    }
}
</style>
